This repository has been archived by the owner on Aug 2, 2022. It is now read-only.
Fix issue where live chart height is only partial of window in fullscreen mode. Issue: #186 #189
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
ohltyler
approved these changes
May 29, 2020
ylwu-amzn
approved these changes
May 29, 2020
public/pages/Dashboard/index.scss
Outdated
| position: absolute; | ||
| top: 0; | ||
| left: 0; | ||
| width: 100%; | ||
| height: 100%; | ||
| height: 100vh; |
There was a problem hiding this comment.
Why this will fix the problem? Live chart on detector detail page is using 100% and no such problem.
There was a problem hiding this comment.
vh doesn't fix it well, so I change to current solution, setting <EuiPage> height to 100%. 100vh makes sure the screen viewed by user is fully covered, but if page is too long, scrolling down will still show uncovered page. Example is below:
Height 100% does its work, so I also use the same css full-screen as detector detail page uses. But height 100% works if <EuiPage> height is 100%, as root cause explained above. Detail page has no such problem because its height is already very long.
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Issue #, if available:
#186
Description of changes:
Fix issue where live chart height is only partial of window in fullscreen mode.
The root cause:
<EuiPage>doesn't explicitly set height as 100%, such that Dashboard page shrinks automatically if no live result or no sunburst result. Evenfull-screencss sets 100% height, the result height of full screen live chart is only 100% of theshrinkedDashboard page, while the height of live chart is fixed to 400px in full screen mode. More explanation: https://stackoverflow.com/a/31728799Before:
After:
By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.